<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=1200, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
    />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>福建省图书馆馆藏文献知识资源数据库</title>
    <link rel="stylesheet" href="./images/css/main.css" />
  </head>
  <body>
    <div class="page-list">
      <header class="app-header">
        <div class="container">
          <a href=""><img src="./images/title.png" alt="" /></a>
        </div>
      </header>

      <div class="container">
        <section class="search">
          <div class="hd">
            <div class="tit">筛选</div>
            <a class="clear">
              <img src="./images/remove.png" />
              清空所选分组
            </a>
          </div>
          <div class="search-panel">
            <dl class="group">
              <dt class="label">图书/古籍</dt>
              <div class="values">
                <dd class="value active"><a>全部</a></dd>
                <dd class="value"><a>全部</a></dd>
                <dd class="value"><a>全部</a></dd>
              </div>
            </dl>
            <dl class="group">
              <dt class="label">图书/古籍</dt>
              <div class="values">
                <dd class="value active"><a>全部</a></dd>
                <dd class="value"><a>全部</a></dd>
                <dd class="value"><a>全部</a></dd>
              </div>
            </dl>
            <dl class="group">
              <dt class="label">图书/古籍</dt>
              <div class="values">
                <dd class="value active"><a>全部</a></dd>
                <dd class="value"><a>全部</a></dd>
                <dd class="value"><a>全部</a></dd>
              </div>
            </dl>
          </div>
        </section>

        <div class="list">
          <a href="" class="list-item">
            <div class="thumb">
              <div
                class="book-cover"
                style="background-image: url(https://placeimg.com/300/200/tech)"
              ></div>
            </div>
            <div class="content">
              <div class="hd">
                <span class="tag">[图书]</span>
                <span class="tit"
                  >Lorem ipsum dolor sit amet, consectetur.</span
                >
              </div>
              <dl class="meta">
                <div>
                  <dt>责任者：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
                <div>
                  <dt>创作时间：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
                <div>
                  <dt>创作地点：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
                <div>
                  <dt>内容：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
                <div>
                  <dt>内容：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
                <div>
                  <dt>内容：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
              </dl>
            </div>
            <div class="mark"><span class="select-none">图表</span></div>
          </a>

          <a href="" class="list-item">
            <div class="thumb">
              <div
                class="book-cover"
                style="background-image: url(https://placeimg.com/300/200/tech)"
              ></div>
            </div>
            <div class="content">
              <div class="hd">
                <span class="tag">[图书]</span>
                <span class="tit"
                  >Lorem ipsum dolor sit amet, consectetur.</span
                >
              </div>
              <dl class="meta">
                <div>
                  <dt>责任者：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
                <div>
                  <dt>创作时间：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
                <div>
                  <dt>创作地点：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
                <div>
                  <dt>内容：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
                <div>
                  <dt>内容：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
                <div>
                  <dt>内容：</dt>
                  <dd>Lorem ipsum dolor sit amet.</dd>
                </div>
              </dl>
            </div>
            <div class="mark"><span class="select-none">图表</span></div>
          </a>
        </div>
      </div>
    </div>
  </body>
</html>
